<template>
  <uni-popup ref="popup" type="center">
    <view class="package direction-start" style="width:600rpx;padding:30rpx;">
      <view>您现在有{{userInfo.gem}}蓝宝石</view>
      <view style="margin:10rpx 0px 50rpx;">可以前往福利商城兑换礼品</view>
      <view class="add" @click="jump()">立即前往</view>
    </view>
  </uni-popup>
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  import { navTo } from '@/utils/navigator';
  import { useUserStore } from '@/stores/user';
  const userInfo = useUserStore();
  const popup = ref(null)
  function open() {
    popup.value.open();
  }
  function close() {
    popup.value.close();
  }
  function jump() {
    close()
    navTo('index/gemstone')
  }
  defineExpose({
    open,
    close
  });
</script>

<style scoped lang="less">
  .add {
    width: 230rpx;
    height: 69rpx;
    border-radius: 5px;
    text-align: center;
    line-height: 69rpx;
    background: #468FF5;
    color: #FFF;
    margin: 0rpx auto;
  }
</style>